/* 课程列表样式 */
.courseList {
  @apply w-full;
}

.listHeader {
  @apply flex items-center justify-between p-4 bg-gray-50 rounded-lg mb-4;
  border: 1px solid #f0f0f0;
}

.selectSection {
  @apply flex items-center gap-3;
}

.selectedCount {
  @apply text-blue-600 text-sm font-medium;
}

.listContent {
  @apply mb-4;
}

.cardGrid {
  @apply grid gap-4;
  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
}

.cardWrapper {
  @apply w-full;
}

.loadingContainer {
  @apply flex items-center justify-center py-16;
}

.emptyContainer {
  @apply flex items-center justify-center py-16;
}

.paginationContainer {
  @apply flex justify-center pt-4 border-t border-gray-100;
}

/* 响应式设计 */
@media (max-width: 1200px) {
  .cardGrid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }
}

@media (max-width: 768px) {
  .cardGrid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  
  .listHeader {
    @apply flex-col items-start gap-3 p-3;
  }
  
  .selectSection {
    @apply w-full;
  }
  
  .paginationContainer {
    @apply pt-3;
  }
  
  .paginationContainer :global(.ant-pagination) {
    @apply text-sm;
  }
}

@media (max-width: 480px) {
  .cardGrid {
    gap: 8px;
  }
  
  .listHeader {
    @apply p-2;
  }
  
  .selectedCount {
    @apply text-xs;
  }
}

/* 暗色主题支持 */
@media (prefers-color-scheme: dark) {
  .listHeader {
    @apply bg-gray-800 border-gray-700;
  }
  
  .selectedCount {
    @apply text-blue-400;
  }
  
  .paginationContainer {
    @apply border-gray-700;
  }
  
  .loadingContainer :global(.ant-spin-text) {
    @apply text-gray-300;
  }
}